<h2>Nuevo Turno</h2>
<hr class='dot'>
<div class='box rounded gradient-graphite'>
	<g:form url="${[action:'saveturno', controller:'medico']}" name="nuevoturnoform" id="nuevoturnoform">
		<ul style='list-style:none'>
			<li>
				<h3>Medico: ${session.medicoLogged.nombre } ${session.medicoLogged.apellido}</h3>
			</li>
			<li>
				<h3>Paciente:
					<g:select onChange='getPacienteHorarios()' id='pacientecombo' name="paciente" from="${pacientesList}" optionKey="id" />
				</h3>
			</li>			
			<li>
				<h3>Fechas Disponibles: </h3>
				<select id='dateTurno' name='dateTurno' size="10">				
				</select>
			</li>
			<li>
				<g:submitButton name="submitTurno" value="Reservar" class='btn'/>
			</li>
		</ul>
	</g:form>
	<script type="text/javascript">
		$(document).ready(function(){
			getPacienteHorarios();
		});
		
		function getPacienteHorarios(){
			$.ajax({
				type : 'POST', 
				url: '${application.getContextPath()}/turno/getpacienteturnos',
				data : "paciente=" + $("#pacientecombo option:selected").val(),
				dataType: 'json',
				success: function(data){
					$("#dateTurno").html("");
					for(var a = 0 ; a < data.length; a++){
						$("#dateTurno").append("<option>" + data[a] + "</option>");
					}
				}			
			});				
		}
	</script>
</div>